import React, { useState } from 'react'
import { EnvironmentOutline,RightOutline } from 'antd-mobile-icons'
import {NavLink,Outlet} from 'react-router-dom'
function Index() {

   
    return (
        <div>
            <div style={{position:'fixed'}}>
                <div style={{float:'left',marginTop:'14px',marginLeft:'10px'}} >
                <NavLink to='/indexa'><EnvironmentOutline fontSize={30}  color='green' /> </NavLink>
                     <span style={{fontSize:'22px'}}>北京 </span> </div> 
                 <div style={{float:'left',marginTop:'14px',marginLeft:'10px'}}><input type="text" /> <button style={{borderRadius:'10px',backgroundColor:'green',width:'80px',color:'white'}}><NavLink to='/indexse'>搜索</NavLink> </button></div> 
            </div>
            <div >

                <img src='https://tse2-mm.cn.bing.net/th/id/OIP-C.oaOwO-RtCN68vbo01OnvZAHaLH?rs=1&pid=ImgDetMain' alt="" style={{width:'100%',height:'350px'}} />
            </div>

            <div>
                <img src="../img/1.png" alt=""  style={{width:'90%' ,marginLeft:'5%',borderRadius:'10px' ,position:'absolute',top:'330px' }}/>


            </div>

            <div>
                <img src="../img/2.png" alt=""  style={{width:'90%' ,marginLeft:'5%',borderRadius:'10px' ,marginTop:'100px'}}/>
            </div>
            <div  style={{width:'90%' ,marginLeft:'5%',marginTop:'10px'}}>
                <div style={{fontSize:'23px',fontWeight:'bold', float:'left'}}>新人专享</div> <div style={{float:'right',color:'greenyellow',fontWeight:'bold'}}><RightOutline  fontSize={30} /></div>
            </div>
            <div style={{width:'90%' ,marginLeft:'5%',borderRadius:'10px', marginTop:'60px',height:'500px',}}>
                <div style={{height:'220px',backgroundColor: 'rgba(230, 230, 230, 0.5)',width:'45%',borderRadius:'15px',float:'left',marginLeft:'2%',marginTop:'10px'}}>
                    <img src="../img/3.jpg" alt="" style={{width:'100%',height:'180px',borderRadius:'15px'}} />
                    <p style={{fontSize:'20px',marginLeft:'30px',color:'white'}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

                </div>
                <div style={{height:'220px',backgroundColor: 'rgba(230, 230, 230, 0.5)',width:'45%',borderRadius:'15px',float:'left',marginLeft:'2%',marginTop:'10px'}}>
                    <img src="../img/3.jpg" alt="" style={{width:'100%',height:'180px',borderRadius:'15px'}} />
                    <p style={{fontSize:'20px',marginLeft:'30px',color:'white'}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

                </div>
                <div style={{height:'220px',backgroundColor: 'rgba(230, 230, 230, 0.5)',width:'45%',borderRadius:'15px',float:'left',marginLeft:'2%',marginTop:'10px'}}>
                    <img src="../img/3.jpg" alt="" style={{width:'100%',height:'180px',borderRadius:'15px'}} />
                    <p style={{fontSize:'20px',marginLeft:'30px',color:'white'}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

                </div>
                <div style={{height:'220px',backgroundColor: 'rgba(230, 230, 230, 0.5)',width:'45%',borderRadius:'15px',float:'left',marginLeft:'2%',marginTop:'10px'}}>
                    <img src="../img/3.jpg" alt="" style={{width:'100%',height:'180px',borderRadius:'15px'}} />
                    <p style={{fontSize:'20px',marginLeft:'30px',color:'white'}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

                </div>

            </div>
            <div style={{height:'100px',width:'90%' ,marginLeft:'5%',overflow:'hidden'}}>
                <div style={{fontSize:'80px',color:'green',float:'left',marginLeft:'30px',marginTop:'-30px'}}>---</div><div style={{fontSize:'80px',color:'green',float:'right',marginRight:'30px',marginTop:'-30px'}}>---</div>

                <div style={{width:'100%',height:'50px',marginTop:'40px'}}>
                    <p style={{marginLeft:'125px',fontSize:'20px',fontWeight:'bold',color:'greenyellow'}}>今日介绍</p>
                </div>
            </div>
            <div style={{height:'500px',width:'90%' ,marginLeft:'5%',borderRadius:'15px',backgroundColor: 'rgba(230, 230, 230, 0.8)'}}>
            <img src="../img/4.png" alt="" style={{width:'100%',borderRadius:'15px'}} />
            <p style={{fontSize:'20px',marginLeft:'30px',}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

            </div>
            <div style={{height:'500px',width:'90%' ,marginLeft:'5%',borderRadius:'15px',backgroundColor: 'rgba(230, 230, 230, 0.8)'}}>
            <img src="../img/4.png" alt="" style={{width:'100%',borderRadius:'15px'}} />
            <p style={{fontSize:'20px',marginLeft:'30px',}}>玫瑰 <span style={{color:'greenyellow'}}>99元</span></p>

            </div>
            <div style={{width:'100%',height:'100px'}}>

            </div>
           
            
        
        </div>
    )
}

export default Index
